<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
    <style media="print">
      /* p {
            color: blue;
        } */
      /* @media not print and (max-width: 500px){
        p {
          color: blue;
        }
      } */
      /* vh viewheight vw viewwidth  */
      /* vmin vmax */
      /* 
        1vh 视口高度分为100份， 1vh 1份。
        1vw 视口高度分为100份， 1vw 1份
      */
      body {
        min-height: 100vh;
      }
    </style>
  </head>
  <body>
    <p>CSS 媒体查询</p>
  </body>
</html>

